<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>05员工表格练习</title>
</head>
<body>
<input type="text" id="i1">
<input type="text" id="i2">
<input type="text" id="i3">
<button onclick="addEmp()">添加</button>
<hr>
<table border="1">
    <caption>员工表</caption>
    <tr>
        <th>姓名</th>
        <th>工资</th>
        <th>岗位</th>
    </tr>
</table>
<script>
    //准备一个空数组，用来保存所有的员工数据
    let arr=[];

    function addEmp(){
        let name=document.getElementById('i1').value;
        let salary=document.getElementById('i2').value;
        let job=document.getElementById('i3').value;
        let table=document.querySelector('table');
        let tr=document.createElement('tr');
        let nameTd=document.createElement('td');
        nameTd.innerHTML=name;
        let salaryTd=document.createElement('td');
        salaryTd.innerHTML=salary;
        let jobTd=document.createElement('td');
        jobTd.innerHTML=job;
        tr.append(nameTd,salaryTd,jobTd);
        table.append(tr);

        document.getElementById('i1').value='';
        document.getElementById('i2').value='';
        document.getElementById('i3').value='';

        arr.push({
            name:name,
            salary:salary,
            job:job
        })
        console.log(arr);

    }
</script>
</body>
</html>